<template name="stars">
	<view class="movie-score-w">
		<!-- <image src="../../static/icos/star-yellow.png" class="star"></image>
		<image src="../../static/icos/star-yellow.png" class="star"></image>
		<image src="../../static/icos/star-yellow.png" class="star"></image>
		<image src="../../static/icos/star-yellow.png" class="star"></image> -->
		<image v-for="item in yelloScore" :key="item.key" src="../../static/icos/star-yellow.png" class="star"></image>
		<image v-for="item in grayScore" :key="item.key" src="../../static/icos/star-gray.png" class="star"></image>
		<view class="movie-score" v-if="showNum == 1">
			{{innerScore}}
		</view>
	</view>
</template>`

<script>
	export default {
		name:"stars",
		data() {
			return {
				yelloScore:0, 
				grayScore:5
			};
		},
		props:{
			innerScore:0, //定义外部传入的分数
			showNum:0 	//定义是否显示具体的分数 1:显示 0:不显示
		},
		created() {
			var tempScore = 0
			if(this.innerScore != null && this.innerScore != undefined && this.innerScore != ''){
				tempScore = this.innerScore
			}
			var yelloScore = parseInt(tempScore/2)
			var grayScore = 5-yelloScore
			
			this.yelloScore = yelloScore
			 this.grayScore = grayScore
		}
	}
</script>

<style>
@import url("./stars.css");
</style>